
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!doctype html>
<html lang="ch">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="左右结构项目，属于大人员的社交工具">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>校园网上订餐系统</title>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
	$(function() {
		$(".meun-item").click(function() {
			$(".meun-item").removeClass("meun-item-active");
			$(this).addClass("meun-item-active");
			var itmeObj = $(".meun-item").find("img");
			itmeObj.each(function() {
				var items = $(this).attr("src");
				items = items.replace("_grey.png", ".png");
				items = items.replace(".png", "_grey.png")
				$(this).attr("src", items);
			});
			var attrObj = $(this).find("img").attr("src");
			;
			attrObj = attrObj.replace("_grey.png", ".png");
			$(this).find("img").attr("src", attrObj);
		});
		$("#topAD").click(function() {
			$("#topA").toggleClass(" glyphicon-triangle-right");
			$("#topA").toggleClass(" glyphicon-triangle-bottom");
		});
		$("#topBD").click(function() {
			$("#topB").toggleClass(" glyphicon-triangle-right");
			$("#topB").toggleClass(" glyphicon-triangle-bottom");
		});
		$("#topCD").click(function() {
			$("#topC").toggleClass(" glyphicon-triangle-right");
			$("#topC").toggleClass(" glyphicon-triangle-bottom");
		});
		$(".toggle-btn").click(function() {
			$("#leftMeun").toggleClass("show");
			$("#rightContent").toggleClass("pd0px");
		})
	})
</script>

<!-- 引入layui.css文件 -->
<link rel="stylesheet" href="layui/css/layui.css" media="all">

<!--1. Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">


<style type="text/css">
::-webkit-scrollbar {
	display: none
}

.table {
	table-layout: fixed;
	/*word-wrap: break-word;
	overflow: hidden;*/
}

td {
	width: 100%;
	word-break: keep-all;
	/* 不换行 */
	white-space: nowrap;
	/* 不换行 */
	/*overflow: hidden;*/
	overflow-x: scroll;
	/* 内容超出宽度时隐藏超出部分的内容 */
	/*text-overflow: ;*/
	/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
}
</style>
<script type="text/javascript">
	$(function() {
		$(".tdd").mouseover(function() {
			alert($(this).text());
		});
	});
</script>

<!--[if lt IE 9]>
  <script src="js/html5shiv.min.js"></script>
  <script src="js/respond.min.js"></script>
<![endif]-->
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/common.css" />
<link rel="stylesheet" type="text/css" href="css/slide.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/flat-ui.min.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.nouislider.css">
</head>

<body>
	<div id="wrap">
		<!-- 左侧菜单栏目块 -->
		<div class="leftMeun" id="leftMeun">
			<div id="logoDiv">
				<p id="logoP">
					<img id="logo" src="images/logo3.jpg"><span>与食俱进</span>
				</p>
			</div>
			<div id="personInfor">
				<p  id="shopname">大洋</p>
				<p></p>
				<p>
					<a>退出登录</a>
				</p>
			</div>
			<div class="meun-title">餐品管理</div>
			<div class="meun-item" href="#shop" aria-controls="shop" role="tab"
				data-toggle="tab">
				<img src="images/icon_source.png">餐品管理
			</div>
			<div class="meun-item" href="#users" aria-controls="users" role="tab"
				data-toggle="tab">
				<img src="images/icon_chara_grey.png">餐品类型管理
			</div>
			<div class="meun-title">订单管理</div>
			<div class="meun-item" href="#orders" aria-controls="orders"
				role="tab" data-toggle="tab">
				<img src="images/icon_house.png">订单管理
			</div>
			<div class="meun-item" href="#statistics" aria-controls="statistics"
				role="tab" data-toggle="tab">
				<img src="images/icon_source.png">营业额统计
			</div>
			<div class="meun-item meun-item-active" href="#comments"
				aria-controls="comments" role="tab" data-toggle="tab">
				<img src="images/icon_source.png">评价管理
			</div>
		</div>
		<!-- 右侧具体内容栏目 -->
		<div id="rightContent">
			<a class="toggle-btn" id="nimei"> <i
				class="glyphicon glyphicon-align-justify"></i>
			</a>
			<!-- Tab panes -->
			<div class="tab-content">
				<!-- 评价管理模块 -->
				<div role="tabpanel" class="tab-pane" id="comments"
					style="display: block;">

					<div class="check-div form-inline">
						<form class="col-xs-12" align="right" action="CommentsServlet"
							method="post">
							<input type="text" class="form-control input-sm"
								placeholder="输入评论内容搜索" name="keywords" value="${keywords}"
								id="keywords">
								<input type="hidden" class="form-control"
								name="op" value="shopqueryByPage">
							<!-- <button class="btn btn-white btn-xs ">查 询</button> -->
							<input type="button" value="查 询" style="width: 45px;" class="btn btn-white btn-xs" id="query">
						</form>
					</div>
					<div class="data-div">
						<table class="table table-striped">
							<tr>
								<td class="col-lg-2 col-md-2 col-sm-2 col-xs-2">订单编号</td>
								<td class="col-lg-2 col-md-2 col-sm-2 col-xs-2">用户编号</td>
								<td class="col-lg-2 col-md-2 col-sm-2 col-xs-2">商品编号</td>
								<td class="col-lg-2 col-md-2 col-sm-2 col-xs-2">评价内容</td>
								<td class="col-lg-3 col-md-3 col-sm-3 col-xs-3 levl3">回复内容</td>
								<td class="col-lg-1 col-md-1 col-sm-1 col-xs-1 levl3">操作</td>
							</tr>
							<c:if test="${pd != null}">
								<c:forEach items="${pd.data}" var="comments">
									<tr>
										<td>${comments.orderid}</td>
										<td>${comments.userid}</td>
										<td>${comments.shopid}</td>
										<td>${comments.commentsinfo}</td>
										<td>${comments.shopanswer}</td>
										<td><button class="btn btn-success btn-xs updatetype" data-toggle="modal"
												data-target="#reply">回复</button></td>
									</tr>
								</c:forEach>
							</c:if>
						</table>

						<!-- 显示 分页导航区域 -->
						<div id="pagediv" style="text-align: center"></div>
						
						<!--回复评价  -->
						<div class="modal fade" id="reply" role="dialog"
						aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="gridSystemModalLabel">回复内容</h4>
								</div>
								<div class="modal-body">
									<div class="container-fluid">
									<%=request.getAttribute("msg") == null ? "" : request.getAttribute("msg")%>
										<form class="form-horizontal" action="CommentsServlet" method="post">
											<div class="form-group ">
												<div class="col-xs-6 ">
												<input type="text" id="shopanswer" name="shopanswer" style="width:300px;height:150px;">
												</div>
											</div>
											<input type="hidden" name="op" value="addshopanswer">
											<button type="button" class="btn btn-xs btn-white"
													data-dismiss="modal">取 消</button>
											<input type="button" class="btn btn-xs btn-green" id="addanswer" value="提交">
										</form>
									</div>
								</div>
							</div>
							<!-- /.modal-content -->
						</div>
						<!-- /.modal-dialog -->
					</div>

						
						<!-- /.modal -->

					</div>

				</div>
			</div>
		</div>

		<script src="js/jquery.nouislider.js"></script>

		<script src="layui/layui.js" charset="utf-8"></script>

		<!-- this page specific inline scripts -->
		<script>
			//min/max slider
			function huadong(my, unit, def, max) {
				$(my).noUiSlider(
						{
							range : [ 0, max ],
							start : [ def ],
							handles : 1,
							connect : 'upper',
							slide : function() {
								var val = Math.floor($(this).val());
								$(this).find(".noUi-handle").text(val + unit);
								console.log($(this).find(".noUi-handle")
										.parent().parent().html());
							},
							set : function() {
								var val = Math.floor($(this).val());
								$(this).find(".noUi-handle").text(val + unit);
							}
						});
				$(my).val(def, true);
			}
			huadong('.slider-minmax1', "分钟", "5", 30);
			huadong('.slider-minmax2', "分钟", "6", 15);
			huadong('.slider-minmax3', "分钟", "10", 60);
			huadong('.slider-minmax4', "次", "2", 10);
			huadong('.slider-minmax5', "天", "3", 7);
			huadong('.slider-minmax6', "天", "8", 10);
		</script>

		
		<script>
layui.use(['laypage', 'layer'], function(){
  var laypage = layui.laypage
  ,layer = layui.layer;
  
//完整功能
  laypage.render({
    elem: 'pagediv'
    ,theme:'#7D9EC0'
    ,count: ${pd.totalCount}
    ,curr: ${pd.page}
    ,limit: ${pd.pageSize}
    ,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
    ,jump: function(obj, first){
	    //obj包含了当前分页的所有参数，比如：
	    console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
	    console.log(obj.limit); //得到每页显示的条数
	    
	    //首次不执行
	    //分页的时候也要把查询的关键字传到servlet
	    if(!first){
	      //do something
	       location.href="CommentsServlet?op=shopqueryByPage&page="+obj.curr+"&pageSize="+obj.limit+"&keywords="+$("#keywords").val()+"&shopname="+$("#shopname").text();
	    }
	  }
  });
 
});

</script>
		
			<script type="text/javascript">
	
$(function(){
console.log(${pd == null});
		if(${pd == null}){
			location.href="CommentsServlet?op=shopqueryByPage&shopname="+$("#shopname").text();
		}
	
	console.log("关键字"+$("#keywords").val());
		$("#query").click(function(){
			location.href="CommentsServlet?op=shopqueryByPage&shopname="+$("#shopname").text()+"&keywords="+$("#keywords").val();
		});
		
		
		$("#addanswer").click(function(){
			var value = $("#shopanswer").text();
			$(this).parents("tr").find("td").eq(4).text(value);
			location.href="CommentsServlet?op=addshopanswer&shopname="+$("#shopname").text()+"&shopanswer="+$("#shopanswer").text();
		});
		
		
		
}); 
</script>
</body>

</html>